<!DOCTYPE HTML>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0, minimum-scale=1.0, user-scalable=0, initial-scale=1.0, width=device-width" />
    <meta name="format-detection" content="telephone=no, email=no, date=no, address=no">
    <title>云钢</title>
    <link rel="stylesheet" type="text/css" href="../../css/aui.css" />
    <link rel="stylesheet" type="text/css" href="../../css/aui-flex.css">
    <link rel="stylesheet" type="text/css" href="../../css/style.css" />
    <style>
        .aui-bar-light{ color: black; }
        .aui-bar-nav.aui-bar-light .aui-iconfont{ color: black; }
    </style>
</head>

<body>
    <header class="aui-bar aui-bar-nav aui-bar-light" id="header">
        <a class="aui-pull-left aui-btn" onclick="backpage()">
            <span class="aui-iconfont aui-icon-left"></span>
        </a>
        <div class="aui-title">订单详情</div>
    </header>
    <div id="app" v-cloak class="padding-bottom">
        <div class="wmax bg-blue padding-lr-xl padding-tb flex-between">
            <div class="text-white">
                <h3>待签合同</h3>
                <p class="text-white">剩余12小时35分自动关闭</p>
            </div>
            <div><i class="aui-iconfont aui-icon-edit text-white text-xl"></i></div>
        </div>
        <div class="padding-lr">
            <div class="margin-top radius padding wmax" style="background: white;">
                <div class="flex-between"><i class="aui-iconfont aui-icon-info text-red"></i><p class="margin-left">供应商、采购商双方都需签订电子合同，若任意一方
                    未签订，该订单都将存在于“待签合同”类目。</p></div>
                <p class="text-center margin-top" style="color: #40AAF4;">当前采购商已签合同，您还未签</p>
                <p class="margin-top"><div class="aui-btn aui-btn-info aui-btn-block round">签订电子合同</div></p>
            </div>
            <div class="radius margin-top padding-lr padding-tb-xl" style="background: white;">
                <div class="flex-between">
                    <div class="flex-between"><img src="../../image/send/xx01.png" alt="" style="width: 2rem;height: 2rem;"></div>
                    <div style="width: 83%;">
                        山西省太原市小店区晋阳街与产业路交叉口联合大厦<span class="padding-left">刘**</span><span class="padding-left">150****0000</span>
                    </div>
                </div>
            </div>
                <div class="radius margin-top padding-lr padding-tb" style="background: white;">
                    <div class="flex-between">
                        <div class="flex-between"><span style="margin-top: 0.2rem;">采购明细</span></div>
                        <div class="">
                            <!-- <i class="aui-iconfont aui-icon-right"></i> -->
                        </div>
                    </div>
                    <h3 class="margin-top text-bold">钢材售卖货品名称钢材售卖货品名称钢材售卖</h3>
                    <p class="margin-top">货品规格：中型料</p>
                    <p class="margin-top">供货数量：100吨</p>
                    <p class="margin-top">供货价格：1.2元/吨</p>
                    <div class="margin-top flex-between padding-top" style="border-top: 0.05rem solid #ccc;">
                        <div></div>
                        <div>小计：<span class="text-red">1200.00元</span></div>
                    </div>
                </div>
                <div class="radius margin-top padding-lr padding-tb" style="background: white;">
                    <div class="flex-between">
                        <div class="flex-between"><span style="margin-top: 0.2rem;">订单信息</span></div>
                        <div class="">
                            <!-- <i class="aui-iconfont aui-icon-right"></i> -->
                        </div>
                    </div>
                    <p class="margin-top">订单编号： 2020091103512478</p>
                    <p class="margin-top">创建时间： 2020-09-11 17:01:52</p>
                    <p class="margin-top">
                        订单备注：备注内容备注内容备注内容备注内容备注内
                        容备注内容备注内容。</p>
                </div>
    
        </div>
    </div>
</body>
<script type="text/javascript" src="../../script/api.js"></script>
<script type="text/javascript" src="../../script/vue.js"></script>
<script type="text/javascript">

    var vm = {
        el: '#app',
        data: {
            list: []
        },
        mounted: function(){
            this.getList();
        },
        methods: {
            getList: function(){
                let that = this;
            }
        }
    }
    apiready = function() {
        $api.fixStatusBar(
            $api.byId("header")
        );
        // window.app = new Vue(vm);
        

    };

    function backpage(){
        api.closeWin({
            name: api.winName
        })
        
    }

</script>

</html>
